<template>
    <div>
        <el-image src="../src/assets/images/about/BANNER@2x.png"></el-image>
        <!-- 内容 -->
        <div class="content flex">
            <div class="c_left">
                <div :class="{item, active:item.active }" v-for="item,index in navlist" :key="index" @click="selectnav(index)">{{ item.name }}</div>
            </div>
            <!-- 关于我们 -->
            <div class="c_right"  v-show="page == 0">
                <div class="title">
                    <div class="h1">中兴贸易有限公司企业简介</div>
                    <div class="h1_label">——深耕湾区三十载，铸就多元生态服务领航者</div>
                </div>
                <div class="r_text">
                    <div class="h2">一、企业概览：从社区商超到城市服务生态的蜕变</div>
                    <div class="text">中兴贸易有限公司始创于1993年，发轫于广州南沙一片滨海热土。三十年来，我们以“资源为基、服务为魂、创新为脉”为经营理念，从一家200平方米的社区超市起步，逐步构建起涵盖商业零售、物业租赁、工程服务、智慧物流四大板块的综合性服务体系。截至2023年，公司总资产规模突破85亿元，业务覆盖粤港澳大湾区9个核心城市，员工总数逾600人，年均服务企业客户超1500家，个人消费者超300万人次，成为大湾区城市服务领域的标杆企业。</div>
                    <div class="null_line"> </div>
                    
                    <div class="h2">二、发展脉络：三次战略跃升的成长密码</div>
                    <div class="h2">1. 1993-2005年：民生筑基，扎根湾区</div>
                    <div class="text">在南沙经济开发区初建的年代，我们以“中兴百货”切入民生刚需，首创“早市鲜蔬直送+夜市便民特惠”模式，打破传统商超营业时间限制，迅速成为本地家庭的生活中心。1998年，洞察到南沙港口建设带动的仓储需求，公司投资建设首座8000㎡现代化仓库，开启“商超+仓储”双轮驱动模式，奠定多元化发展基因。</div>
                    <div class="h2">2. 2006-2015年：资源整合，全链布局</div>
                    <div class="text">随着粤港澳大湾区规划落地，我们抓住基建浪潮，分三步完成产业链延伸：</div>
                    <div class="text"><span class="dot"></span>2007年：成立中兴工程设备公司，购置首批30台重型机械，参与港珠澳大桥配套工程建设；</div>
                    <div class="text"><span class="dot"></span>2012年：收购南沙核心商圈12处临街物业，打造“中兴金街”商业地标；</div>
                    <div class="text"><span class="dot"></span>2015年：组建智能物流事业部，自主研发“运力蜂巢”调度系统，实现运输效率提升40%。</div>
                    <div class="h2">3. 2016年至今：数字赋能，生态共生</div>
                    <div class="text">启动“智慧中兴2025”战略，投资超亿元完成三大数字化工程：</div>
                    <div class="text"><span class="dot"></span>资产云平台：实现98%物业线上VR看房、合同电子签约；</div>
                    <div class="text"><span class="dot"></span>设备物联网：200+台工程机械安装GPS与工况传感器，故障预警响应缩短至2小时；</div>
                    <div class="text"><span class="dot"></span>零售大数据中心：通过消费数据分析，精准指导商超选品与社区服务优化。</div>
                    <div class="null_line"> </div>

                    <div class="h2">三、业务版图：四维驱动的城市服务引擎</div>
                    <div class="h2">1. 商超零售：有温度的社区生活枢纽</div>
                    <div class="text">旗下“中兴生活广场”与“滨海邻里中心”两大品牌商超，总经营面积达5.2万㎡，日均客流量1.2万人次，形成三大特色：</div>
                    <div class="text"><span class="dot"></span>生鲜革命：与50公里内200余家农户建立直采联盟，果蔬损耗率控制在3%以下；</div>
                    <div class="text"><span class="dot"></span>便民生态：集成政务自助终端、24小时药房、社区食堂等15项便民服务；</div>
                    <div class="text"><span class="dot"></span>文化赋能：打造“渔民文化展区”“非遗手作工坊”，年举办民俗活动超百场。</div>
                    <div class="h2">2. 物业运营：全生命周期资产增值</div>
                    <div class="text">管理58万㎡多元化物业资产，构建“3+3”服务体系：</div>
                    <div class="text"><span class="dot"></span>三大产品线：</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>产业园区：8个智能制造基地，配备光伏发电与工业废水循环系统；</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>商业综合体：3处TOD模式开发项目，地铁无缝衔接；</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>社区商业：86间临街旺铺，独创“租金+流量分成”招商模式。</div>
                    <div class="text"><span class="dot"></span>三大增值服务：</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>企业选址AI评估系统，匹配精度达90%；</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>绿色建筑改造咨询，助力客户获LEED认证；</div>
                    <div class="text"><span class="space"></span><span class="dot"></span>法律风控团队年均处理合同纠纷低于0.5%。</div>
                    <div class="h2">3. 工程服务：大国基建的幕后力量</div>
                    <div class="text">拥有217台重型设备与80人特种作业团队，形成三大能力壁垒：</div>
                    <div class="text"><span class="dot"></span>设备矩阵：涵盖土方开挖、起重吊装、混凝土浇筑全流程，最大单机起重能力300吨；</div>
                    <div class="text"><span class="dot"></span>智慧管理：通过物联网平台实时监控油耗、工时、维修记录，设备利用率达92%；</div>
                    <div class="text"><span class="dot"></span>应急响应：2022年台风“暹芭”期间，48小时内完成珠海机场20台滞留设备转运。</div>
                    <div class="h2">4. 智慧物流：产业流通的数字化动脉</div>
                    <div class="text">运营80+台标准化车队与3万㎡智能仓储，打造三大核心优势：</div>
                    <div class="text"><span class="dot"></span>精准时效：大湾区主要城市6小时直达，冷链运输温控精度±1℃；</div>
                    <div class="text"><span class="dot"></span>特种资质：拥有危险品运输、跨境保税物流等12项专业认证；</div>
                    <div class="text"><span class="dot"></span>科技赋能：运用区块链技术实现货运单据全程可追溯，纠纷率下降75%。</div>
                    <div class="null_line"> </div>
                    
                    <div class="h2">四、核心优势：硬实力与软价值的双重赋能</div>
                    <div class="h2">1. 资源网络密度</div>
                    <div class="text"><span class="dot"></span>在南沙自贸区持有土地储备超200亩，距南沙港码头仅15分钟车程；</div>
                    <div class="text"><span class="dot"></span>与三一重工、沃尔玛等30家行业龙头建立战略合作，共享设备与渠道资源。</div>
                    <div class="h2">2. 技术护城河</div>
                    <div class="text"><span class="dot"></span>累计获得23项技术专利，包括“工程设备健康度预测算法”“仓储能耗优化系统”；</div>
                    <div class="text"><span class="dot"></span>2021年成为华为城市智慧服务生态合作伙伴，共建5G+工业互联网平台。</div>
                    <div class="h2">3. 可持续发展实践</div>
                    <div class="text"><span class="dot"></span>绿色运营：所有新建物业100%采用光伏建筑一体化设计，年减排二氧化碳8000吨；</div>
                    <div class="text"><span class="dot"></span>社区共生：设立“中兴教育基金”，资助本地贫困学子超500人次；疫情期间为商户减免租金超1200万元。</div>
                    <div class="null_line"> </div>
                    
                    <div class="h2">五、未来图景：向智慧城市服务商进化</div>
                    <div class="text">面向2025年，公司锚定三大战略方向：</div>
                    <div class="text"><span class="dot"></span>数字孪生：构建物业、设备、物流的虚拟仿真系统，实现资源调度零时差；</div>
                    <div class="text"><span class="dot"></span>零碳转型：2024年投入运营大湾区首个氢能运输示范车队，2030年全面实现碳中和；</div>
                    <div class="text"><span class="dot"></span>生态互联：开放数据中台，与政府智慧城市系统对接，成为城市治理的神经末梢。</div>
                    <div class="null_line"> </div>

                    <div class="h2">三十载风雨兼程，中兴贸易始终秉持“与城市共生，与时代共振”的初心。我们不仅是空间与设备的提供者，更是城市效率的提升者、产业升级的助推者、美好生活的缔造者。期待与您携手，共绘大湾区发展的壮阔蓝图！</div>
                </div>
            </div>
            <!-- 发展历程 -->
            <div class="c_right" v-show="page == 1">
                <div class="title">
                    <div class="h1">中兴贸易有限公司发展历程</div>
                    <div class="null_line"> </div>
                </div>
                <div class="r_text">
                    <div class="item">
                        <div class="item_title flex">
                            <div class="left">1993-2000年</div>
                            <div class="center"></div>
                            <div class="h2">扎根南沙，民生筑基</div>
                        </div>
                        <div class="item_main">
                            <div class="text"><span class="dot"></span>创立首家社区商超，以“平价、新鲜、便民”打开市场，日均客流量突破3000人次。</div>
                            <div class="text"><span class="dot"></span>1998年建成首座自持仓储中心，开启物业租赁业务雏形。</div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="item_title flex">
                            <div class="left">2001-2010年</div>
                            <div class="center"></div>
                            <div class="h2">多元开拓，资源整合</div>
                        </div>
                        <div class="item_main">
                            <div class="text"><span class="dot"></span>2003年组建工程运输车队，承接南沙港一期基建项目设备支持。</div>
                            <div class="text"><span class="dot"></span>2008年整合工业厂房资源，打造首个智能化产业园区，年出租率达98%。</div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="item_title flex">
                            <div class="left">2011-2020年</div>
                            <div class="center"></div>
                            <div class="h2">科技赋能，战略升级</div>
                        </div>
                        <div class="item_main">
                            <div class="text"><span class="dot"></span>2015年引入物联网管理系统，实现车辆设备全生命周期数字化管控。</div>
                            <div class="text"><span class="dot"></span>2019年建成大湾区首个“商超+物流+社区服务”综合体，获评省级示范项目。</div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="item_title flex">
                            <div class="left">2021年至今</div>
                            <div class="center"></div>
                            <div class="h2">绿色转型，全域协同</div>
                        </div>
                        <div class="item_main">
                            <div class="text"><span class="dot"></span>2022年启动新能源运输车队置换计划，碳减排量同比提升40%。</div>
                            <div class="text"><span class="dot"></span>2023年成立城市更新事业部，深度参与旧工业区改造与产业升级。</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script setup>
import {reactive, ref} from 'vue';

const navlist = reactive([
    {
        name:'关于我们',
        active:true,
        route:'/about/ours'
    },
    {
        name:'发展历程',
        active:false,
        route:'/about/progress'
    },
])
let page = ref(0)

const selectnav = (index)=>{
    navlist.forEach((i)=>{
        i.active = false
    })
    navlist[index].active = true;

    page.value = index
}
</script>
<style lang="less" scoped>
@import '@/assets/css/common.css';
.content{
    padding: 80px 16%;
    .c_left{
        text-align: center;
        width: 10%;
        padding: 0 20px;
        .item{
            color: #555555;
            margin-bottom: 40px;
        }
        .item:hover{
            cursor: pointer;
        }
        .active{
            color: #EB3C03;
        }
    }
    .c_right{
        width: 89%;
        border-left: 2px solid #EEEEEE;
        padding-left: 30px;
        .title{
            margin-bottom: 10px;
            .h1{
            color: #333333;
            margin-bottom: 10px;
            font-size: 24px;
            font-weight: bold;
            text-align: center;
            }
            .h1_label{
                text-align: center;
                font-size: 14px;
                color: #222222;
            }
        }
        
        .null_line{
                height: 14px;
            }
        .r_text{
            .h2{
                height: 40px;
                line-height: 40px;
                font-size: 14px;
                color: #222222;
            }
            .text{
                color: #666666;
                font-size: 14px;
                line-height: 30px;
                .space{
                    display: inline-block;
                    width: 16px;
                }
                .dot{
                    display: inline-block;
                    background: #555555;
                    border-radius: 50%;
                    transform: translate(0,-3px);
                    width: 5px;
                    height: 5px;
                    margin: 0 5px;
                }
            }
            .item{
                .item_title{
                    margin-bottom: 6px;
                    .left{
                        text-align: center;
                        width: 100px;
                        height: 26px;
                        line-height: 26px;
                        background: #EB3C03;
                        color: #ffffffd5;
                        font-size: 14px;
                        border-radius: 5px;
                        margin-top: 10px;
                    }
                    .center{
                        background: #E4E7ED;
                        width: 15px;
                        height: 15px;
                        border-radius: 50%;
                        margin: 20px 8px 0;
                    }
                }
                .item_main{
                    border-left: 2px solid #E4E7ED;
                    margin-left: 115px;
                    padding-left: 16px;
                }
                
            }
        }
    }
}
</style>